<template>
	<view class="w-670">
		<view class="margin-top text-gray fs-24">广发趋势优选灵活配置混合(000215)</view>

		<view class="margin-top-lg">
			<text class="title fs-32">到账账户</text>
			<view class="cu-list menu-avatar">
				<view class="cu-item">
					<view class="cu-avatar"
						style="background-image:url(https://gss0.baidu.com/70cFfyinKgQFm2e88IuM_a/baike/pic/item/4e83cb62e9f5e3fde6113a45.jpg);">
					</view>
					<view class="content">
						<view class="fs-40 text-bold">建设银行(尾号5789)</view>
						<view class="fs-24 text-gray">可赎回627.00份</view>
					</view>
				</view>
			</view>
		</view>

		<view class="flex justify-between align-center">
			<view class="text-bold text-lg">
				<text>赎回份额</text>
				<text class="cuIcon-info padding-left text-gray"></text>
			</view>
			<view class="fs-24">交易规则</view>
		</view>
		<view class="input">
			<input type="text" v-model="vla" :class="[vla?'text-bold':'']" placeholder="最少赎回1.00份"
				placeholder-class="text-gray" />
		</view>
		<view class="margin-top-lg">
			<button class=" cu-btn line-orange text-bold" @tap="vla='2.50'">25%</button>
			<button class=" cu-btn line-orange text-bold margin-left" @tap="vla='5.00'">50%</button>
			<button class=" cu-btn line-orange text-bold margin-left">全部</button>
		</view>
		<view class="margin-top fs-24 text-gray">
			<text>赎回费率</text>
			<text class="text-yellow">0.00%~1.50%</text>
			<text>持有时长越长费率越低,详见交易规则将被</text>
			<text class="text-yellow">4月26日</text>
			<text>净值计算金额，预计</text>
			<text class="text-yellow">4月29日24点</text>
			<text>钱到账(以银行到账时间为准)</text>
		</view>
		<view class=" footer">
			<button class="cu-btn block  margin-tb-sm lg text-white" :class="[vla?'bg-blue':'bg-cc']"
				@tap="isPay">确认</button>
		</view>
		<view class="margin-top fs-24 text-gray footer">
			<view>产品销售服务,由小雨点基金销售有限公司提供</view>
			<view class="padding-top">产品过往业绩不预示其未来表现，市场有风险，投资须谨慎</view>
		</view>
		<!-- 密码支付 -->
		<payPass ref="verify" @finish="getCode">></payPass>
	</view>
</template>

<script>
	import payPass from '../../components/pay-pass/pay-pass.vue'
	export default {
		components: {
			payPass
		},
		data() {
			return {
				vla: ''
			}
		},
		methods: {
			isPay() {
				if (this.vla) {
					this.yzbtn()
				}

			},
			// 支付模态框隐藏
			zfhide(){
				this.$refs.verify.hide();
			},
			
			yzbtn: function() {
				this.$refs.verify.show();
			},
			
			// 模态框支付
			getCode: function(e) {
				console.log(e); //输入内容
				// 假设用户密码是123456
				if (e != 123456) {
					// 输入错误提示
					uni.showToast({title: '密码错误,请重新输入',duration: 2000,icon: 'none'})
						
				} else{
					// 输入正确模态框隐藏
					uni.showToast({title: '提交成功！',duration: 2000});
					this.zfhide();
				   setTimeout(()=>	uni.navigateBack({data:1}),1000)
				
				}
						
			},
		}
	}
</script>

<style scoped lang="scss">
	.color-47 {
		color: #E2E2E2;
	}

	.bg-cc {
		background-color: #CCCCCC;
	}

	.input {
		font-size: 50rpx;
		margin-top: 50rpx;
		padding: 20rpx 0;

	}

	.footer {
		margin-top: 100rpx;
	}
</style>
